<!doctype html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang=""> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8" lang=""> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9" lang=""> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
    <head>
        <meta charset="utf-8">
        <title>XPay个人收款支付系统</title>
        <meta name="keywords" content="XPay个人收款支付系统,个人支付接口,无需签约,无需第三方SDK,完全免费">
        <meta name="description" content="XPay个人收款支付系统 个人支付接口 无需签约 无需第三方SDK 完全免费">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="icon" type="image/png" href="favicon.ico">

        <link rel="stylesheet" href="assets/css/swiper.min.css">
        <link rel="stylesheet" href="assets/css/animate.css">
        <link rel="stylesheet" href="assets/css/iconfont.css">
        <link rel="stylesheet" href="assets/css/font-awesome.min.css">
        <link rel="stylesheet" href="assets/css/bootstrap.min.css">
        <link rel="stylesheet" href="assets/css/magnific-popup.css">
        <link rel="stylesheet" href="assets/css/bootsnav.css">

        <!--For Plugins external css-->
        <!--<link rel="stylesheet" href="assets/css/plugins.css" />-->
        <!--Theme custom css -->
        <link rel="stylesheet" href="assets/css/style.css">

        <!--Theme Responsive css-->
        <link rel="stylesheet" href="assets/css/responsive.css" />

        <script src="assets/js/vendor/modernizr-2.8.3-respond-1.4.2.min.js"></script>

    </head>

    <body data-spy="scroll" data-target=".navbar-collapse">


        <!-- Preloader -->
        <div id="loading">
            <div id="loading-center">
                <div id="loading-center-absolute">
                    <div class="object" id="object_one"></div>
                    <div class="object" id="object_two"></div>
                    <div class="object" id="object_three"></div>
                    <div class="object" id="object_four"></div>
                </div>
            </div>
        </div><!--End off Preloader -->


        <div class="culmn">
            <!--Home page style-->

            <nav class="navbar navbar-default bootsnav navbar-fixed white no-background">
                <div class="container">  

                    <!-- Start Atribute Navigation -->
                    <div class="attr-nav">
                        <ul>
                            <li><a href="http://xmall.exrick.cn" target="_blank" title="Github"><i class="fa fa-github" style="font-size:21px"></i></a></li>
                            <li><a href="http://blog.exrick.cn" target="_blank" title="作者博客"><i class="fa fa-user-circle" style="font-size:18px"></i></a></li>
                            <li><a><i class="fa fa-qrcode" style="font-size:19px" title="Star或捐赠后可加入Q群" data-container="body" data-toggle="popover" data-placement="bottom"
                                data-html="true" data-content="<img src='assets/images/qq-qr.png' width='150'>" data-trigger="hover"></i></a></li>
                        </ul>
                    </div>        
                    <!-- End Atribute Navigation -->


                    <!-- Start Header Navigation -->
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-menu">
                            <i class="fa fa-bars"></i>
                        </button>
                        <a class="navbar-brand" href="index">
                            <img src="assets/images/logo.png" class="logo logo-display" alt="">
                            <img src="assets/images/footer-logo.png" class="logo logo-scrolled" alt="">
                        </a>

                    </div>
                    <!-- End Header Navigation -->

                    <!-- navbar menu -->
                    <div class="collapse navbar-collapse" id="navbar-menu">
                        <ul class="nav navbar-nav navbar-center">
                            <li><a href="index">首页</a></li>
                            <li><a href="pay">支付体验</a></li>
                            <li><a href="thanks">捐赠名单</a></li>
                            <li><a href="http://xmall.exrick.cn" target="_blank">XMall商城</a></li>
                            <li><a href="https://github.com/Exrick/xpay" target="_blank">开发教程</a></li>
                        </ul>
                    </div><!-- /.navbar-collapse -->
                </div>   
          </nav>

            <!--Home Sections-->

            <section id="home" class="home">
                <div class="container">
                    <div class="row">
                        <div class="main_home">
                            <div class="col-md-6">
                                <div class="home_text">
                                    <h1 class="text-white">XPay 个人收款支付系统</h1>
                                    <!-- <h5 class="text-white" style="">XPay 个人收款支付系统</h5> -->
                                </div>

                                <div class="home_btns m-top-40">
                                    <a href="pay" target="_blank" class="btn btn-danger m-top-20">立即体验</a>
                                    <a href="https://github.com/Exrick/xpay" target="_blank" class="btn btn-primary m-top-20">开发教程</a>
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="phone_one phone_attr1 text-center sm-m-top-50">
                                    <div class="attr_deg">开源</div>
                                    <div class="attr_rio text-uppercase">极简</div>
                                    <div class="attr_sun text-uppercase text-white">完全免费</div>
                                    <div class="attr_lon text-uppercase text-white">无需签约</div>
                                    <img src="http://oweupqzdv.bkt.clouddn.com/phone01.png" alt="" />
                                </div>
                            </div>

                        </div>
                        <div class="scrooldown">
                            <a href="#features"><i class="fa fa-chevron-down"></i></a>
                        </div>

                    </div><!--End off row-->
                </div><!--End off container -->
            </section> <!--End off Home Sections-->



            <!--Featured Section-->
            <section id="features" class="features">
                <div class="container">
                    <div class="row">
                        <div class="main_features p-top-100">
                            <div class="col-md-8 col-md-offset-2 col-sm-12 col-xs-12">
                                <div class="head_title text-center">
                                    <h2>自动化解决方案</h2>
                                    <h5>完美解决个人在线收款支付接口难题</h5>
                                </div>
                            </div>

                            <div class="col-md-4">
                                <div class="features_item sm-m-top-30">
                                    <div class="f_item_icon">
                                        <img src="assets/images/icon1.png" width="75px">
                                    </div>
                                    <div class="f_item_text">
                                        <h3>完全免费</h3>
                                        <p>自动化个人收付款系统，没有中间商赚差价。 
                                           不再忍受第三方抽取手续费</p>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="features_item sm-m-top-30">
                                    <div class="f_item_icon">
                                        <img src="assets/images/icon2.png" width="75px">
                                    </div>
                                    <div class="f_item_text">
                                        <h3>无需任何第三方SDK</h3>
                                        <p>无需集成任何支付SDK代码，极简自定义开发。 
                                           支持任何业务逻辑回调</p>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="features_item sm-m-top-30">
                                    <div class="f_item_icon">
                                        <img src="assets/images/icon3.png" width="75px">
                                    </div>
                                    <div class="f_item_text">
                                        <h3>无需签约</h3>
                                        <p>营业执照？个体工商户？身份证？统统见鬼去吧！ 
                                           一张二维收款码搞定收款</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div><!-- End off row -->
                </div><!-- End off container -->
            </section><!-- End off Featured Section-->



            <section>
                <div class="container">
                    <div class="row">
                        <div class="main_drag roomy-50">
                            <div class="col-md-12">
                                <div class="swiper-container">
                                    <div class="swiper-wrapper">
                                        <div class="swiper-slide" style="background-image:url(http://oweupqzdv.bkt.clouddn.com/drag1.png)"></div>
                                        <div class="swiper-slide" style="background-image:url(http://oweupqzdv.bkt.clouddn.com/drag2.png)"></div>
                                        <div class="swiper-slide" style="background-image:url(http://oweupqzdv.bkt.clouddn.com/drag3.png)"></div>
                                    </div>
                                    <!-- If we need navigation buttons -->
                                    <div class="swiper-button-prev"></div>
                                    <div class="swiper-button-next"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>

            <!--screen short section-->

            <section id="screen_area" class="screen_area">
                <div class="container">
                    <div class="row">
                        <div class="main_screen">
                            <div class="col-md-8 col-md-offset-2 col-sm-12">
                                <div class="head_title text-center">
                                    <h2>支付流程</h2>
                                    <h5>The XPay process</h5>
                                </div>
                            </div>

                            <!-- Screen01-->
                            <div class="screen01 roomy-50">
                                <div class="col-md-6">
                                    <div class="screen01_img text-center">
                                        <div class="attr_cloudy text-white">通知方式</div>
                                        <div class="attr_deg2 text-white">确认订单</div>
                                        <img src="http://oweupqzdv.bkt.clouddn.com/screen01.png" alt="" />
                                        <h1 class="cloudy">Order</h1>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="screen01_content m-top-100">
                                        <div class="screen01_content_img ">
                                            <img src="assets/images/order.png" width="80" alt="" />
                                        </div>
                                        <h2 class="m-top-40">填写确认订单</h2>
                                        <p class="m-top-20">用户确认购买订单后，需填写邮箱或手机号，发送邮件或短信支付结果通知，
                                            以便及时告知用户支付结果 
                                        </p>

                                        <ul class="list-inline m-top-50">
                                            <li class="text-center">邮件</li>
                                            <li class="text-center">短信</li>
                                            <li class="text-center">IM</li>
                                        </ul>
                                    </div>
                                </div>
                            </div><!--End off Screen01-->

                            <!-- Screen02-->
                            <div class="screen02 roomy-50 m-top-100">
                                <div class="col-md-6 col-md-push-6">
                                    <div class="screen02_img text-center">
                                        <div class="attr_sun2 text-white">任意收款码</div>
                                        <div class="attr_deg3 text-white">支付</div>
                                        <img src="http://oweupqzdv.bkt.clouddn.com/screen02.png" alt="" />
                                        <h1 class="sunny">&nbsp;Pay&nbsp;&nbsp;</h1>
                                    </div>
                                </div>
                                <div class="col-md-6 col-md-pull-6">
                                    <div class="screen02_content m-top-100">
                                        <div class="screen02_content_img ">
                                            <img src="assets/images/pay.png" width="80" alt="" />
                                        </div>
                                        <h2 class="m-top-40">扫码支付</h2>
                                        <p class="m-top-20">配置个人的各渠道收款二维码，
                                            支付即时到账</p>

                                        <ul class="list-inline m-top-50">
                                            <li class="text-center">个人</li>
                                            <li class="text-center">任意</li>
                                            <li class="text-center">收款码</li>
                                        </ul>
                                    </div>
                                </div>
                            </div><!--End off Screen02-->

                            <!-- Screen03-->
                            <div class="screen03 roomy-50 m-top-100">
                                <div class="col-md-6">
                                    <div class="screen03_img text-center">
                                        <div class="attr_rainy2 text-white">即时通知</div>
                                        <div class="attr_deg4 text-white">邮件审核</div>
                                        <img src="http://oweupqzdv.bkt.clouddn.com/screen03.png" alt="" />
                                        <h1 class="rainy">Check</h1>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="screen03_content m-top-100">
                                        <div class="screen03_content_img ">
                                            <img src="assets/images/confirm.png" width="80" alt="" />
                                        </div>
                                        <h2 class="m-top-40">审核确认</h2>
                                        <p class="m-top-20">个人管理员收到支付审核通知邮件，确认收款到账，
                                            邮件中进行支付结果审核操作</p>

                                        <ul class="list-inline m-top-50">
                                            <li class="text-center">通知</li>
                                            <li class="text-center">邮件</li>
                                            <li class="text-center">审核</li>
                                        </ul>
                                    </div>
                                </div>
                            </div><!--End off Screen02-->


                        </div>
                    </div><!--End off row-->
                </div><!--End off container-->
            </section><!--End off Screen01 Area Section -->



            <!--People Section-->
            <section id="reviews" class="reviews m-top-100">
                <div class="container">
                    <div class="row">
                        <div class="main_reviews">
                            <div class="col-md-8 col-md-offset-2 col-sm-12">
                                <div class="head_title text-center">
                                    <h2>用户评价</h2>
                                    <h5>Reviews</h5>
                                </div>
                            </div>

                            <div class="reviews_content">
                                <div class="col-md-6">
                                    <div class="reviews_item m-top-40">
                                        <div class="reviews_item_icon pull-left">“</div>
                                        <h3>以后我的收到捐赠的不用手动去维护捐赠表啦，哈哈，感谢. </h3>
                                        <h5>Exrick</h5>
                                        <div class="reviews_item_icon1 pull-right text-right">“</div>
                                    </div>
                                </div><!-- End off col-md-6 -->

                                <div class="col-md-6">
                                    <div class="reviews_item m-top-40">
                                        <div class="reviews_item_icon pull-left">“</div>
                                        <h3>虽然不能商用，但想法很好，适合个人收款不多的使用.</h3>
                                        <h5>Exrick</h5>
                                        <div class="reviews_item_icon1 pull-right text-right">“</div>
                                    </div>
                                </div><!-- End off col-md-6 -->
                                <div class="col-md-6">
                                    <div class="reviews_item m-top-40">
                                        <div class="reviews_item_icon pull-left">“</div>
                                        <h3>正愁个人某宝上都买不到营业执照，找不到靠谱的第三方聚合支付，这确实是一个不错的方案.</h3>
                                        <h5>Exrick</h5>
                                        <div class="reviews_item_icon1 pull-right text-right">“</div>
                                    </div>
                                </div><!-- End off col-md-6 -->
                                <div class="col-md-6">
                                    <div class="reviews_item m-top-40">
                                        <div class="reviews_item_icon pull-left">“</div>
                                        <h3>正好我做的是灰色产业，申请不到支付接口，感谢作者的XPay. </h3>
                                        <h5>Exrick</h5>
                                        <div class="reviews_item_icon1 pull-right text-right">“</div>
                                    </div>
                                </div><!-- End off col-md-6 -->

                            </div>
                        </div><!-- End off Main People -->
                    </div><!-- End off row -->
                </div><!-- End off container -->
            </section><!-- End off People Section-->


            <!--App Download Section-->
            <section id="download" class="download m-top-100">
                <div class="download_overlay"></div>
                <div class="container">
                    <div class="row">
                        <div class="main_download ">
                            <div class="col-md-6">
                                <div class="download_item roomy-100">
                                    <h2 class="text-white">如何开发使用XPay?</h2>
                                    <h5 class="text-white m-top-20">XPay是完全开源免费的个人收款支付系统，
                                        为个人提供了完美的支付解决方案.
                                        系统方案及本网站源码已公开至Github和码云，有详细的教程和源码参考，
                                        详情点击下方链接查看.</h5>

                                    <div class="download_app m-top-30">
                                        <a href="https://github.com/Exrick/xpay" target="_blank"><img src="assets/images/appstor.png" alt="" /></a>
                                        <a href="https://gitee.com/Exrick/xpay"  target="_blank"><img src="assets/images/googleplay.png" alt="" /></a>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="download_item m-top-70">
                                    <img class="app_right" src="assets/images/appdownload1.png" alt="" />
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>

            <!-- scroll up-->
            <div class="scrollup">
                <a href="#"><i class="fa fa-chevron-up"></i></a>
            </div><!-- End off scroll up -->
            
            
            <footer id="footer" class="footer bg-black">
                <div class="container">
                    <div class="row">
                        <div class="col-md-12">
                            <nav class="navbar navbar-default bootsnav footer-menu no-background">
                                <div class="container">  

                                    <!-- Start Atribute Navigation -->
                                    <div class="attr-nav">
                                        <ul>
                                            <li>
                                                <a href="http://xmall.exrick.cn" target="_blank" title="Github">
                                                    <i class="fa fa-github" style="font-size:21px"></i>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="http://blog.exrick.cn" target="_blank" title="作者博客">
                                                    <i class="fa fa-user-circle" style="font-size:18px"></i>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <i class="fa fa-qrcode" style="font-size:19px" title="Star或捐赠后可加入Q群" data-container="body" data-toggle="popover" data-placement="top"
                                                        data-html="true" data-content="<img src='assets/images/qq-qr.png' width='150'>" data-trigger="hover"></i>
                                                </a>
                                            </li>
                                        </ul>
                                    </div>
                                    <!-- End Atribute Navigation -->


                                    <!-- Start Header Navigation -->
                                    <div class="navbar-header">
                                        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-footer">
                                            <i class="fa fa-bars"></i>
                                        </button>
                                        <a class="navbar-brand" href="index"><img src="assets/images/footer-logo.png" class="logo" alt=""></a>
                                    </div>
                                    <!-- End Header Navigation -->

                                    <!-- navbar menu -->
                                    <div class="collapse navbar-collapse" id="navbar-footer">
                                        <ul class="nav navbar-nav navbar-center">
                                            <li><a href="index">首页</a></li>
                                            <li><a href="pay">支付体验</a></li>
                                            <li><a href="thanks">捐赠名单</a></li>
                                            <li><a href="http://xmall.exrick.cn" target="_blank">XMall商城</a></li>
                                            <li><a href="https://github.com/Exrick/xpay" target="_blank">开发教程</a></li>
                                        </ul>
                                    </div><!-- /.navbar-collapse -->
                                </div>   
                            </nav>
                        </div>
                        <div class="divider"></div>
                        <div class="col-md-12">
                            <div class="main_footer text-center p-top-40 p-bottom-30">
                                <p class="wow fadeInRight" data-wow-duration="1s">
                                    <a href="http://blog.exrick.cn/" target="_blank">xpay.exrick.cn </a> ©2017. All Rights Reserved
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
            </footer>




        </div>

        <!-- JS includes -->

        <script src="assets/js/vendor/jquery-1.11.2.min.js"></script>
        <script src="assets/js/vendor/bootstrap.min.js"></script>

        <script src="assets/js/jquery.magnific-popup.js"></script>
        <script src="assets/js/jquery.easing.1.3.js"></script>
        <script src="https://cdn.bootcss.com/Swiper/3.4.0/js/swiper.min.js"></script>
        <script src="assets/js/jquery.collapse.js"></script>
        <script src="assets/js/bootsnav.js"></script>

        <script src="assets/js/plugins.js"></script>
        <script src="assets/js/main.js"></script>
        <script>
            var _hmt = _hmt || [];
            (function() {
                var hm = document.createElement("script");
                hm.src = "https://hm.baidu.com/hm.js?eb9a7bf6c76f2f54bcac6f9fb8c21303";
                var s = document.getElementsByTagName("script")[0];
                s.parentNode.insertBefore(hm, s);
            })();
        </script>

    </body>
    <script>
        $("[data-toggle='popover']").popover();
    </script>
</html>
